<template>
	<div class="nav-bottom">
		<ul>
			<li>
				<router-link to="/">
					<img src="/home-iconic/user-inactive.png" alt="" />
					<h4>home</h4>
				</router-link>
			</li>
			<li>
				<router-link to="/gc">
					<img src="/home-iconic/user-inactive.png" alt="" />
					<h4>广场</h4>
				</router-link>
			</li>
			<li>
				<router-link to="/recommend">
					<img src="/home-iconic/user-inactive.png" alt="" />
					<h4>推荐</h4>
				</router-link>
			</li>
			<li>
				<router-link to="/my">
					<img src="/home-iconic/user-inactive.png" alt="" />
					<h4>个人</h4>
				</router-link>
			</li>
		</ul>
	</div>
</template>

<script></script>

<style lang="scss" scoped>
.nav-bottom {
  width: 100%;
	background-color: #fff;
	position: fixed;
	z-index: 100;
	bottom: 0;
	ul {
		line-height: 28px;
		padding-top: 26px;
		display: flex;
		justify-content: space-around;
		li {
			width: 25%;
			text-align: center;
			img {
				width: 30%;
			}
			h4 {
        margin-top: 12px;
				font-size: 22px;
			}
		}
	}
}
</style>
